<div class="panel panel-default">
  <div class="panel-heading">
    Users
    <span class="pull-right btn-group">
      <a href="" class="btn btn-xs btn-success" ui-sref="^.add()">
        <i class="fa fa-plus"></i>
      </a>
    </span>
  </div>

  <div class='list-group'>
    <div ng-repeat="user in ctrl.users" class="list-group-item">
      <span class="pull-right btn-group">
        <a class="btn btn-xs btn-default" ui-sref="app.users.password({ id: user.id })">
          <i class="fa fa-key"></i>
        </a>
        <a class="btn btn-xs btn-default" ui-sref="app.users.edit({ id: user.id })">
          <i class="fa fa-pencil"></i>
        </a>
        <a class="btn btn-xs btn-danger" ui-sref="app.users.delete({ id: user.id })">
          <i class="fa fa-trash-o"></i>
        </a>
      </span>
      <h4>
        <a href="" ui-sref="app.users.view({id: user.id})">{{user.firstName}} {{user.lastName}}</a>
      </h4>
      {{user.username}}
      <span class="text-muted">{{user.email}}</span>
      <span ng-repeat="role in user.roles" class="label label-default">{{role.name}}</span>

    </div>
  </div>
</div>
